<template>
	<div class="admin_home">
		<div class="bg">
			<Login1 v-show="type=='1' "></Login1>
			<Login2 v-show="type=='2' "></Login2>
			<input class="change" type="submit" @click="changeType()" value="更换登录方式" />
		</div>
	</div>
</template>

<script>
	import Login1 from '../../components/mobile/login/Login1.vue'
	import Login2 from '../../components/mobile/login/Login2.vue'
	export default {
		name: 'MobileLogin',
		components: {
			Login1,
			Login2
		},
		data() {
			return{
				type:'1'
			}
		},
		methods:{
			changeType(){
				switch(this.type){
					case '1':
						this.type='2';
						break;
					case '2':
						this.type='1'
						break;
				}
			},
			
		}
	}
</script>

<style scoped>
	.admin_home {
		background-image: url('../../assets/img/pic1.jpg');
		width:100%;
		height: 100%;
		color: white;
		top: 0;
		left: 0;
		/* position: absolute; */
		z-index: -1;
	}

	.bg{
		height: 100%;
		width: 100%;
		background-color: rgba(72, 72, 72, 0.5);
		text-align: center;
		backdrop-filter: blur(5px);
	}
	.change{
		margin-top: 13rem;
		width: 90%;
		height: 2.5rem;
		border-radius: 0.3rem;
		border:none;
		background-color: rgba(72, 72, 72, 0.5);
		color: white;
		font-size: 1.3rem;
	}
</style>
